let divs = document.querySelectorAll('div')
let lis = document.querySelectorAll('ul li')
let timerId = null

lis.forEach(function (li,i) {
    li.addEventListener('click',function() {    //点击li事件
        clearInterval(timerId)
        timerId = null

        //排他
        lis.forEach(function (li, a) {
            lis[a].classList.remove('on')
        })
        this.classList.add('on')
        //获取滚动高度
        let h = document.documentElement.scrollTop
        // console.log(h);
        // console.log(divs[i].offsetTop); 

        //当窗口滚动离顶部高度大于楼层高度时
        if (h > divs[i].offsetTop) {
            timerId = setInterval(function () {
                h -= 20
                document.documentElement.scrollTop = h
               
                if(Math.abs(divs[i].offsetTop - h)<=20){   //楼层减去窗口滚动离顶部高度的绝对值小于20
                    document.documentElement.scrollTop = divs[i].offsetTop //楼层距顶部等于高度窗口滚动离顶部高度
                    clearInterval(timerId)
                    timerId = null
                }
            }, 10)
        }else{
            timerId = setInterval(function () {
                h += 20
                document.documentElement.scrollTop = h
                
                console.log(divs[i].offsetTop - h);
                if(Math.abs(divs[i].offsetTop - h)<=20){
                    document.documentElement.scrollTop = divs[i].offsetTop
                    clearInterval(timerId)
                    timerId = null
                }
            }, 10)
        }

    })
})
